
<template>
	<div>
	  <MainContent>
		 <div class="content_title">
		 	<span style="color: #222222;font-size: 24px;font-weight: 400;">{{title}}</span>
		 	
		 </div>
		 <div class="table_content">
		 	<el-row>
		 		<div style="display: flex;justify-content: space-between;align-items: center;">
		 			
		 			<span>{{pageKind}}： 1000人</span>
					<button class="el-button mini addBuss" @click="allPass" v-if="status == '1'"> 一键通过</button>
		 		</div>
			   <el-table
		        ref="multipleTable"
		        :data="tableData"
		        v-if="status == '1'"
		        style='width: 99%;margin-top:70px;'
		        tooltip-effect="dark">
						
		        <el-table-column
		          align="center"
		          type='index'
				  style='width:150px!important'
		          label="#">
		        </el-table-column>
		        <el-table-column
		          align="center"
		          prop="UserName"
		          label="用户昵称">
		        </el-table-column>
		        <el-table-column
		          align="center"
		          prop='UserNo'
		          label="用户编码">
		        </el-table-column>
		       	
		        <el-table-column
		          align="center"
		          label="操作">
		          <template slot-scope="scope">
		          	    <el-button
				              size="mini"
				              style='background: #1989FA;color: #FFFFFF;border-radius: 5px;'
				              @click="passTrue(scope.row)">通过</el-button>
		            	<el-button
				              size="mini"
				              type='danger'
				              @click="passFalse(scope.row)">不通过</el-button>
				   </template>
		        </el-table-column>
		     </el-table>
		     
		     <el-table
		        v-if="status == '2'"
		        ref="multipleTable"
		        :data="tableData"
		        style='width: 99%;margin-top:70px;'
		        tooltip-effect="dark">
						
		        <el-table-column
		          align="center"
		          type='index'
				  style='width:150px!important'
		          label="#">
		        </el-table-column>
		        <el-table-column
		          align="center"
		          prop="UserName"
		          label="用户昵称">
		        </el-table-column>
		        <el-table-column
		          align="center"
		          prop='UserNo'
		          label="用户编码">
		        </el-table-column>
		     </el-table>
		     
		     <el-table
		        v-if="status == '3'"
		        ref="multipleTable"
		        :data="tableData"
		        style='width: 99%;margin-top:70px;'
		        tooltip-effect="dark">
						
		        <el-table-column
		          align="center"
		          type='index'
				  style='width:150px!important'
		          label="#">
		        </el-table-column>
		        <el-table-column
		          align="center"
		          prop="UserName"
		          label="用户昵称">
		        </el-table-column>
		        <el-table-column
		          align="center"
		          prop='UserNo'
		          label="用户编码">
		        </el-table-column>
		        
		        <el-table-column
		          align="center"
		          label="用户凭证">
		          
		          <template slot-scope="scope">
		          	    <el-button
				              size="mini"
				              style='background: #1989FA;color: #FFFFFF;border-radius: 5px;'
				              @click="userCart(scope.row)">点击查看</el-button>
				   </template>
		        </el-table-column>
		     </el-table>
		     <el-table
		        v-if="status == '4'"
		        ref="multipleTable"
		        :data="tableData"
		        style='width: 99%;margin-top:70px;'
		        tooltip-effect="dark">
						
		        <el-table-column
		          align="center"
		          type='index'
				  style='width:150px!important'
		          label="#">
		        </el-table-column>
		        <el-table-column
		          align="center"
		          prop="UserName"
		          label="用户昵称">
		        </el-table-column>
		        <el-table-column
		          align="center"
		          prop='UserNo'
		          label="用户编码">
		        </el-table-column>
		        <el-table-column
		          align="center"
		          prop='UserNo'
		          label="结束时间">
		        </el-table-column>
		     </el-table>
		     
		     <el-table
		        v-if="status == '5'"
		        ref="multipleTable"
		        :data="tableData"
		        style='width: 99%;margin-top:70px;'
		        tooltip-effect="dark">
						
		        <el-table-column
		          align="center"
		          type='index'
				  style='width:150px!important'
		          label="#">
		        </el-table-column>
		        <el-table-column
		          align="center"
		          prop="UserName"
		          label="用户昵称">
		        </el-table-column>
		        <el-table-column
		          align="center"
		          prop='UserNo'
		          label="用户编码">
		        </el-table-column>
		        <el-table-column
		          align="center"
		          prop='UserNo'
		          label="关闭时间">
		        </el-table-column>
		     </el-table>
		     
		     <el-table
		        v-if="status == '6'"
		        ref="multipleTable"
		        :data="tableData"
		        style='width: 99%;margin-top:70px;'
		        tooltip-effect="dark">
						
		        <el-table-column
		          align="center"
		          type='index'
				  style='width:150px!important'
		          label="#">
		        </el-table-column>
		        <el-table-column
		          align="center"
		          prop="UserName"
		          label="用户昵称">
		          <template slot-scope="scope">
		          	    <el-button
				              size="mini"
				              style='color: #3185FF;'
				              type='text'
				              @click="lookUserDetail(scope.row)" v-html='scope.row.UserName'></el-button>
				   </template>
		        </el-table-column>
		          
		        <el-table-column
		          align="center"
		          prop='UserNo'
		          label="用户编码">
		        </el-table-column>
		        <el-table-column
		          align="center"
		          prop='UserNo'
		          label="退出时间">
		        </el-table-column>
		     </el-table>
		 	</el-row>
		 	<el-row style='margin-top: 20px;text-align: center;'>
			 	<el-pagination 
					  @current-change="handleCurrentChange"
					  :current-page="currentPage"
			    	   layout="prev, pager, next" 
			    	   page-size='10'
			    	  :total="allPage" 
			    	>
			    </el-pagination>
			</el-row>
		 </div>
		 
		  <el-dialog title="用户详情" :visible.sync="lookOpen2" width='900px'>
		 	<div style="width: 100%;text-align: center;">
		 		<el-row :gutter='50'>
		 			<el-col :lg='12' style='padding:0 80px;'>
		 				<el-row style='height: 40px;'>
		 					<el-col :lg='12' align='left'>
		 						昵称
		 					</el-col>
		 					<el-col :lg='6'  align='right'><span v-html="userDetail.UserName"></span></el-col>
		 				</el-row>
		 				<el-row  style='height: 40px;'>
		 					<el-col :lg='12'  align='left'>用户编码</el-col>
		 					<el-col :lg='6'  align='right'><span v-html="userDetail.UserNo"></span></el-col>
		 				</el-row>
		 				<el-row  style='height: 40px;'>
		 					<el-col :lg='12'  align='left'>淘宝会员名</el-col>
		 					<el-col :lg='6'  align='right'><span v-html="userDetail.UserAuth"></span></el-col>
		 				</el-row>
		 				<el-row  style='height: 40px;'>
		 					<el-col :lg='12'  align='left'>用户组</el-col>
		 					<el-col :lg='6'  align='right'><span v-html="userDetail.UserAuth"></span></el-col>
		 				</el-row>
		 				<el-row  style='height: 40px;'>
		 					<el-col :lg='12'  align='left'>大宝年龄</el-col>
		 					<el-col :lg='10'  align='right'>
		 					   <span v-html="userDetail.BigBabyBirthday"></span>
		 					</el-col>
		 				</el-row>
		 				<el-row  style='height: 40px;'>
		 					<el-col :lg='12'  align='left'>大宝性别</el-col>
		 					<el-col :lg='10'  align='right'>
		 						<span v-html="userDetail.BigBabySex"></span>
		 					</el-col>
		 				</el-row>
		 				<el-row  style='height: 40px;'>
		 					<el-col :lg='12'  align='left'>二宝年龄</el-col>
		 					<el-col :lg='10'  align='right'>
		 						<el-row style='display: flex;justify-content: space-between;'>
		 						   <span v-html="userDetail.SeBabyBirthday"></span>
		 						</el-row>
		 					</el-col>
		 				</el-row>
		 				<el-row  style='height: 40px;'>
		 					<el-col :lg='12'  align='left'>二宝性别</el-col>
		 					<el-col :lg='10'  align='right'>
		 						<span v-html="userDetail.BigBabySex"></span>
		 					</el-col>
		 				</el-row>
		 				<el-row  style='height: 40px;'>
		 					<el-col :lg='12'  align='left'>积分任务</el-col>
		 					<el-col :lg='6'  align='right' >
		 						<span v-html="userDetail.ScoreNumber"></span>
		 					</el-col>
		 					<el-col :lg='6' style='padding-left: 20px;'>
		 						<el-button size='mini' type='primary' @click='lookTaskList'>查看详情</el-button>
		 					</el-col>
		 				</el-row>
		 				<el-row  style='height: 40px;'>
		 					<el-col :lg='12'  align='left'>福利任务</el-col>
		 					<el-col :lg='6'  align='right' >
		 						<span v-html="userDetail.MoneyNumber"></span>
		 					</el-col>
		 					<el-col :lg='6' style='padding-left: 20px;'>
		 						<el-button size='mini' type='primary' @click='lookTaskList2'>查看详情</el-button>
		 					</el-col>
		 				</el-row>
		 			</el-col>
		 			<el-col :lg='12'  style='padding: 0 80px;'>
		 			     <el-row style='text-align: left;margin-bottom: 20px;'>微信收款码</el-row> 
		 			     <el-row style='text-align: left;'>
		 			     	<img :src="userDetail.UserCode" width="203px" height="258px"/>
		 			     </el-row> 
		 			     
		 			</el-col>
		 		</el-row>
		 	</div>
		</el-dialog>
		  <el-dialog title="用户凭证" :visible.sync="lookOpen" width='700px'>
		 	<div style="width: 100%;text-align: center;">
		 		<el-row :gutter='50'>
		 			<el-col :lg='12' style='padding:0 80px;'>
		 				<el-row style='height: 40px;'>
		 					<el-col :lg='12' align='left'>
		 						昵称
		 					</el-col>
		 					<el-col :lg='12'  align='right'>{{authData.UserName}}</el-col>
		 				</el-row>
		 				<el-row  style='height: 40px;'>
		 					<el-col :lg='12'  align='left'>实付款</el-col>
		 					<el-col :lg='12'  align='right'>{{authData.Price}}</el-col>
		 				</el-row>
		 				<el-row  style='height: 40px;'>
		 					<el-col :lg='12'  align='left'>用户编码</el-col>
		 					<el-col :lg='12'  align='right'>{{authData.UserNo}}</el-col>
		 				</el-row>
		 				<el-row  style='height: 40px;'>
		 					<el-col :lg='12'  align='left'>淘宝会员名</el-col>
		 					<el-col :lg='12'  align='right'>{{authData.TaoBaoName}}</el-col>
		 				</el-row>
		 				
		 				<el-row  style='height: 40px;'>
		 					<el-col :lg='12'  align='left'>凭证截图</el-col>
		 					<el-col :lg='24'  align='left' style='margin-top: 10px;'>
		 						<img v-for="item in authData.Pic" :src="item" width="60px" height="60px"/>
		 					</el-col>
		 				</el-row>
		 			</el-col>
		 			<el-col :lg='12'  style='padding: 0 80px;'>
		 			     <el-row style='text-align: left;margin-bottom: 20px;'>微信收款码</el-row> 
		 			     <el-row style='text-align: left;'>
		 			     	<img :src="authData.Code" width="203px" height="258px"/>
		 			     </el-row> 
		 			     
		 			</el-col>
		 		</el-row>
		 		<el-row type='flex' justify='center'>
		 			<el-button size='small' @click='checkFalse'>不合格</el-button>
		 			<el-button type='success' size='small' @click='checkTrue'>合格</el-button>
		 		</el-row>
		 	</div>
		</el-dialog>
      </MainContent>
   </div>
</template>
<script>
	import MainContent from '../components/main_content'
	import global from './global'
	export default {
    name: "BussStatus",
    inject:['reload'],
    mounted(){
    	this.initData('1');
    },
    data() {
    	return {
    		title: this.$route.params.pageKind,
    		pageKind:this.$route.params.pageKind,
    		tableData: [],
    		passKind: '',
    		passUrl: '',
    		taskKind: this.$route.params.taskKind,
    		kind: '0', //任务类型
    		status: this.$route.params.Status,
    		lookOpen: false,
    		lookOpen2:false,
    		allPage: '',
    		currentPage: '1',
    		checkUser: '',
    		authData:{},
    		userDetail:{},
    		checkUserNo: '',
    	}
    },
    components:{
    	MainContent
    },
    methods:{
    	initData(pageNum){
    		console.log(this.$route.params.Id)
    		let _this = this;
    		global.$http({
						method:'get',
						url:global.urlAll+'PcMissionsUserList/',
						headers:{
							'Content-Type':'application/x-www-form-urlencoded',
							'cache-control': 'no-cache, no-store',
							'Pragma': 'no-cache'
						},
						params:{
							MissionId: _this.$route.params.Id,
							Status: _this.$route.params.Status,
							Page: pageNum || '1',
							Row: '10',
						}
					}).then((res)=>{
						if(res.data.Success == 'true'){
							_this.tableData = res.data.Info;
							_this.allPage = res.data.DateNum
							
						}else{
							_this.$message(res.msg)
						}
					})
    	},
    	allPass(){
    		this.addBussOpen = true;
    		this.lookOpen2 = true;
    		let _this = this;
    		global.$http({
						method:'get',
						url:global.urlAll+ 'AKeyCheck/',
						headers:{
							'Content-Type':'application/x-www-form-urlencoded',
							'cache-control': 'no-cache, no-store',
							'Pragma': 'no-cache'
						},
						params:{
							MissionId: _this.$route.params.Id,
							Kind: _this.$route.params.taskKind,
						}
					}).then((res)=>{
						if(res.data.Success == 'true'){
							_this.$message('审核成功');
							_this.initData();
							
						}else{
							_this.$message(res.msg)
						}
					})
    	},
    	userCart(row){
    		let _this = this;
    		let userNo = row.UserNo;
    		this.checkUserNo = row.UserNo;
    		global.$http({
						method:'get',
						url:global.urlAll+ 'CheckDetail/',
						headers:{
							'Content-Type':'application/x-www-form-urlencoded',
							'cache-control': 'no-cache, no-store',
							'Pragma': 'no-cache'
						},
						params:{
							UserNo: userNo,
							MissionId: _this.$route.params.Id,
							Kind: _this.$route.params.taskKind,
						}
					}).then((res)=>{
						if(res.data.Success == 'true'){
							_this.authData = res.data;
							
						}else{
							_this.$message(res.msg)
						}
					})
    		this.lookOpen = true;
    	},
    	//查看用户详情
    	lookUserDetail(row){
    		let _this = this;
    		let userNo = row.UserNo;
    		global.$http({
						method:'get',
						url:global.urlAll+ 'UserDetailInfo/',
						headers:{
							'Content-Type':'application/x-www-form-urlencoded',
							'cache-control': 'no-cache, no-store',
							'Pragma': 'no-cache'
						},
						params:{
							UserNo: userNo,
						}
					}).then((res)=>{
						if(res.data.Success == 'true'){
							_this.userDetail = res.data;
							
						}else{
							_this.$message(res.msg)
						}
					})
    		this.lookOpen2 = true;
    	},
        passTrue(row){
 			let _this = this;
        	this.$confirm('是否确认通过?', '提示', {
		         confirmButtonText: '确定',
		         cancelButtonText: '取消',
		         type: 'warning'
		       }).then(() => {
        		_this.passUrl = 'AcceptCheck/';
        		_this.checkUrl = row.UserNo;
		       	_this.confirmFunction();
		       })
        	
        },
    	passFalse(row){
			let _this = this;
    		this.$confirm('是否确认不通过?', '提示', {
		         confirmButtonText: '确定',
		         cancelButtonText: '取消',
		         type: 'warning'
		       }).then(() => {
        		_this.passUrl = 'RefuseCheck/';
        		_this.checkUrl = row.UserNo;
		       	_this.confirmFunction();
		       })
    	},
    	checkFalse(){
    		let _this = this;
    		this.$confirm('是否确认提交?', '提示', {
		         confirmButtonText: '确定',
		         cancelButtonText: '取消',
		         type: 'warning'
		       }).then(() => {
        		_this.passUrl = 'RefuseFinishMission/';
        		_this.checkUrl = _this.checkUserNo;
		       	_this.confirmFunction();
		       })
    	},
    	checkTrue(){
    		let _this = this;
    		this.$confirm('是否确认提交?', '提示', {
		         confirmButtonText: '确定',
		         cancelButtonText: '取消',
		         type: 'warning'
		       }).then(() => {
        		_this.passUrl = 'AcceptFinishMission/';
        		_this.checkUrl = _this.checkUserNo;
		       	_this.confirmFunction();
		       })
    	},
    	confirmFunction(){
    		let _this = this;
    		this.lookOpen = false;
    		this.lookOpen2 = false;
    		
    		global.$http({
						method:'get',
						url:global.urlAll+ _this.passUrl,
						headers:{
							'Content-Type':'application/x-www-form-urlencoded',
							'cache-control': 'no-cache, no-store',
							'Pragma': 'no-cache'
						},
						params:{
							UserNo: _this.checkUrl,
							MissionId: _this.$route.params.Id,
							Kind: _this.$route.params.taskKind,
						}
					}).then((res)=>{
						
						if(res.data.success == 'true'){
							_this.$message('提交成功');

							_this.initData();
							
						}else{
							_this.$message(res.msg)
						}
					})
    	},
    	handleCurrentChange(val){
    		let _this = this;
    		this.currentPage = val;
    		this.initData(val)
    	}
    },
   }
	
	
</script>

<style scoped="scoped">
	.content_title {
	padding-bottom: 30px;
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    
  }
  .addBuss{
  	width: 150px;
  	height: 40px;
  	background: #1989FA;
  	color: #FFFFFF;
    font-weight: bold;
	margin-right:20px;
  }
  .table_content{
  	padding: 20px;
  	background: #FFFFFF;
  }
  tbody,thead {
	  width: 100% !important;
	}
	colgroup {
	  position: absolute;
	  width: 100% !important;
	  display: flex;
	}
	col {
	  flex: 1;
	  text-align: center;
	}
	.el-input1{
		height:36px;
		background:rgba(255,255,255,1);
		border:1px solid rgba(220,223,230,1);
		border-radius:4px;
		text-align: center;
	}
</style>